<template>
  <div class="d_main not">
    <div class="d_header">
      <div class="d_header_title">
        <div class="back pointer" @click="Back">
          <span class="el-icon-arrow-left"></span>
          <p>返回</p>
        </div>
        <h3>工艺异常明细</h3>
      </div>
    </div>
    <div class="d_content">
      <el-form
        ref="orderForm"
        label-position="left"
        :model="productFrom"
        class="orderForm"
      >
        <div class="d_content_left">
          <div class="d_orderDetails">
            <div class="item">
              <div class="cTitle">
                <h3>订单信息</h3>
              </div>
              <dl>
                <dt>订单单号</dt>
                <dd>{{ productFrom.baseData.xieYiShuHao || '--' }}</dd>
              </dl>
              <dl>
                <dt>订单类型</dt>
                <dd>{{ productFrom.baseData.orderTypeName || '--' }}</dd>
              </dl>
              <dl>
                <dt>客户单号</dt>
                <dd>{{ productFrom.baseData.customerBillNo || '--'}}</dd>
              </dl>
              <dl>
                <dt>合同号</dt>
                <dd>{{ productFrom.baseData.contractCode || '--'}}</dd>
              </dl>
            </div>
            <div class="item">
              <div class="cTitle">
                <h3>产品信息</h3>
              </div>
              <dl>
                <dt>产品名称</dt>
                <dd>{{ productFrom.baseData.orderProductName || '--' }}</dd>
              </dl>
              <dl>
                <dt>产品板面</dt>
                <dd> {{ productFrom.baseData.printingSurface || '--' }}</dd>
              </dl>
              <dl>
                <dt>产品版本</dt>
                <dd> {{ productFrom.baseData.productVersions || '--' }}</dd>
              </dl>
            </div>
            <div class="item">
              <div class="cTitle">
                <h3>业务信息</h3>
              </div>
              <dl>
                <dt>标签套数</dt>
                <dd>{{ productFrom.baseData.taoZhuangQuantity || '--' }}<span class="unit">{{productFrom.baseData.taoZhuangQuantity == productFrom.baseData.tagSumQuantity?'枚':'套'}}</span></dd>
              </dl>
              <dl>
                <dt>标签枚数</dt>
                <dd>{{ productFrom.baseData.tagSumQuantity || '--' }}<span class="unit">枚</span></dd>
              </dl>
            </div>
            <div class="item">
              <div class="cTitle">
                <h3>数据信息</h3>
              </div>
              <dl>
                <dt>数据来源</dt>
                <dd>{{ productFrom.baseData.dataComeFromName || '--' }}</dd>
              </dl>
              <dl>
                <dt>数据数量</dt>
                <dd>{{ productFrom.baseData.tagDataQuantity || '--' }}</dd>
              </dl>
              <dl>
                <dt>数据状态</dt>
                <dd>{{ productFrom.baseData.dataProduceState || '--' }}</dd>
              </dl>
            </div>
            <div class="item">
              <div class="cTitle">
                <h3>套装关系</h3>
              </div>
              <labelTree :tree-data="productFrom.packageRelations" />
            </div>
            <div class="item">
              <div class="cTitle">
                <h3>产品包装</h3>
              </div>
              <dl>
                <dt>成品样式</dt>
                <dd>{{ productFrom.productData.productStyleName || '--' }}</dd>
              </dl>
              <dl v-if="productFrom.productData.productStyle !== 1">
                <dt>出标方向</dt>
                <dd>{{ productFrom.productData.outDirectionName || '--' }}</dd>
              </dl>
              <dl v-if="productFrom.productData.productStyle === 2">
                <dt>卷向</dt>
                <dd>{{ productFrom.productData.scrollDirectionName || '--' }}</dd>
              </dl>
              <dl>
                <dt>贴标方式</dt>
                <dd>{{ productFrom.productData.tagAffixWayName || '--' }}</dd>
              </dl>
              <dl v-if="productFrom.productData.productStyle === 2">
                <dt>卷芯大小</dt>
                <dd> {{ productFrom.productData.mandrelSize || '--' }}<span class="unit">mm</span></dd>
              </dl>
              <dl v-if="productFrom.productData.productStyle === 2">
                <dt>外直径不超过</dt>
                <dd>{{ productFrom.productData.notOverDiameter || '--' }}<span class="unit">mm</span></dd>
              </dl>
              <dl v-if="productFrom.productData.productStyle === 2">
                <dt>每卷等于</dt>
                <dd>{{ productFrom.productData.pageEqualTags || '--' }}<span class="unit">{{productFrom.baseData.taoZhuangQuantity == productFrom.baseData.tagSumQuantity?'枚':'套'}}</span></dd>
              </dl>
              <dl v-if="productFrom.productData.productStyle !== 2">
                <dt>每张等于</dt>
                <dd>{{ productFrom.productData.pageEqualTags || '--' }}<span class="unit">{{productFrom.baseData.taoZhuangQuantity == productFrom.baseData.tagSumQuantity?'枚':'套'}}</span></dd>
              </dl>
              <dl v-if="productFrom.productData.productStyle !== 2">
                <dt>每包等于</dt>
                <dd>{{ productFrom.productData.packageEqualPages || '--' }}<span class="unit">张</span></dd>
              </dl>
              <dl>
                <dt>每箱等于</dt>
                <dd>{{ productFrom.productData.boxEqualPackages || '--' }}<span class="unit">{{ productFrom.productData.productStyle !== 2 ? "包" : "卷" }}</span></dd>
              </dl>
              <dl>
                <dt>每箱共计</dt>
                <dd>{{ productFrom.productData.boxEqualTags || '--' }}<span class="unit">{{productFrom.baseData.taoZhuangQuantity == productFrom.baseData.tagSumQuantity?'枚':'套'}}</span></dd>
              </dl>
            </div>
            <div class="item">
              <div class="cTitle">
                <h3>订单备注</h3>
              </div>
              <div class="d_remark">
                {{ productFrom.baseData.orderRemark }}
              </div>
            </div>
            <div class="item">
              <div class="cTitle">
                <h3>其他信息</h3>
              </div>
              <dl>
                <dt>业务员</dt>
                <dd>{{ productFrom.baseData.salesmanName || '--' }}</dd>
              </dl>
              <dl>
                <dt>联系电话</dt>
                <dd>{{ productFrom.baseData.salesmanMobile || '--' }}</dd>
              </dl>
            </div>
          </div>
        </div>
        <div class="d_content_auto">
          <div class="content">
            <!-- 操作区 E-->
            <div class="d_nrBox p16">
            <template v-for="item in detailData" >
              <div class="cTitle" :key="item.produceMachineCode">
                <h3>{{ item.produceMachineName }}</h3>
              </div>
              <div class="tableCon">
                <el-table
                  ref="multipleTable"
                  :data="item.workDataList"
                  border
                  style="width: 100%"
                >
                  <el-table-column prop="produceWorkTime" width="180" label="任务时间" />
                  <el-table-column prop="workPersonName"  width="80" label="任务人员" />
                  <el-table-column prop="reelNumber" width="80" label="卷号" />
                  <el-table-column prop="beginPageNo" width="80" label="开始页码" />
                  <el-table-column prop="endPageNo" width="80" label="结束页码" />
                  <el-table-column prop="workExceptionReason" label="异常原因" />
                  <el-table-column prop="workExceptionRemark" label="备注" />
                </el-table>
              </div>
            </template>
            </div>
          </div>
        </div>
      </el-form>
    </div>
  </div>
</template>
<script>
import SelectCraftlist from '@/components/selectCraft'
import SelectMateriaList from '@/components/selectMaterial'
import labelTree from '@/components/labelTree'
import { mapGetters } from 'vuex'
import { uuid } from 'vue-uuid'
import Sortable from 'sortablejs'
import ElImageViewer from 'element-ui/packages/image/src/image-viewer'
export default {
  name: '',
  components: { labelTree, SelectCraftlist, SelectMateriaList, ElImageViewer },
  computed: {
    ...mapGetters(['userInfo', 'name'])
  },
  data() {
    return {
      loading: null,
      productFrom: {
        baseData: {},
        packageData: {},
        orderBaseData: {},
        productData: {},
      },

      detailData:[]
    }
  },
  created() {
    // this.getTypeStatus()
    this.loading = this.$loading({
      lock: true,
      text: '数据加载中',
      spinner: 'el-icon-loading',
      fullscreen: true,
      background: 'rgba(0, 0, 0, 0.7)'
    })
    this.getOrderDetail()
    this.getOrderInfo()
  },
  deactivated() {
    // localStorage.removeItem('orderInit')
  },
  beforeDestroy() {
    // localStorage.removeItem('orderInit')
  },
  mounted() {
  },
  methods: {

    // 获取订单详情
    getOrderDetail() {
      const parmas = {
        saleOrderNo: this.$route.query.orderNo
      }
      this.$api.report
        .GetProduceWorkExceptionsForOrder(parmas)
        .then((res) => {
          this.detailData = res
          this.loading.close()
        })
        .catch(() => {
          this.loading.close()
        })
    },

    getOrderInfo() {
      const parmas = {
        saleOrderNo: this.$route.query.orderNo,
      };
      this.$api.business
        .GetSaleOrderDetail(parmas)
        .then((res) => {
          this.productFrom = res;
          this.getList();
        })
        .catch(() => {});
    },
    // 返回
    Back() {
      this.$router.go(-1)
    }
  }
}
</script>
<style lang="scss" scoped>

</style>
<style lang="scss">
.el-loading-mask {
  top: 0;
}
</style>
